<template>
  <!--支付成功页面 -->
  <div>
    <!-- 支付成功提示信息  -->
    <van-row>
      <van-col span="24" style="margin-top: 15%">
        <van-icon name="checked" color="#06C160" size="35" /><span
          style="font-size: 25px; color: #06c160; font-weight: 600"
          >&nbsp;&nbsp;支付成功</span
        >
      </van-col>
    </van-row>

    <!-- 收款商家名称 -->
    <van-row>
      <van-col span="24" style="margin-top: 25%">
        <span style="font-size: 25px; text-align: center">{{
          storeName
        }}</span>
      </van-col>
    </van-row>

    <!--付款金额  -->
    <van-row>
      <van-col span="24" style="margin-top: 20px">
        <span style="font-size: 40px; font-weight: 700; text-align: center"
          >￥{{ payMoney }}</span
        >
      </van-col>
    </van-row>

    <!-- 完成按钮,点击返回主页 -->
    <van-tabbar style="height: 20%">
      <van-col span="24"
        ><van-button
          round
          style="
            background-color: #f3f3f3;
            height: 60px;
            width: 60%;
            font-size: 20px;
            color: #06c160;
            font-weight: 600;
          "
          @click="goHome"
          >完成</van-button
        ></van-col
      >
    </van-tabbar>
  </div>
</template>

<script>
export default {
  props: {
    //注册属性，用来父子组件传递参数使用
  },
  data() {
    //定义数据的地方
    return {
      storeName: "", //店铺名称
      payMoney: '', //支付金额
    };
  },
  created() {
    this.storeName = this.$route.query.storeName;
    this.payMoney = this.$route.query.payMoney;
    console.log("获取的店铺名称..." + storeName);
    console.log("获取的支付金额..." + payMoney);
  },

  mounted() {},

  methods: {
    goHome() {
      this.$router.push("/");
    },

    //  方法事件处理
    jump(uri) {
      this.$router.push(
        uri,
        () => {},
        () => {}
      );
    },
  },
  components: {},
};
</script>
